$(document).ready(function () {
    if (getCookie('code') == 201) {
        $("#header-nav a").eq(3).css('color', 'yellowgreen')
    } else {
        window.location.href = "home.html"
    }
    $('#input1').css('width', $('#input1').attr('placeholder').length * 14.4)
    $('#input2').css('width', $('#input2').attr('placeholder').length * 10.1)
    $('#input3').css('width', $('#input3').attr('placeholder').length * 14.4)
    $('#input4').css('width', $('#input4').attr('placeholder').length * 10)
    $('#input5').css('width', $('#input5').attr('placeholder').length * 15.4)
    $('#input6').css('width', $('#input6').attr('placeholder').length * 15.4)
    $('#input7').css('width', $('#input7').attr('placeholder').length * 13)
    $('#input8').css('width', $('#input8').attr('placeholder').length * 12.5)
    $('#input1').bind({
        keyup: function () {
            $(this).css('width', $(this).val().length * 14.4)
            $('#body2-top h2').html($(this).val())
        },
        change: function () {
            $(this).css('width', $(this).val().length * 14.4)
            $('#body2-top h2').html($(this).val())
        }
    })
    $('#input2').bind({
        keyup: function () {
            $(this).css('width', $(this).val().length * 10.1)
            $('#body2-top p').html($(this).val())
        },
        change: function () {
            $(this).css('width', $(this).val().length * 10.1)
            $('#body2-top p').html($(this).val())
        }
    })
    $('#input3').bind({
        keyup: function () {
            $(this).css('width', $(this).val().length * 14.4)
            $('#body2-top-span1').html($(this).val())
        },
        change: function () {
            $(this).css('width', $(this).val().length * 14.4)
            $('#body2-top-span1').html($(this).val())
        }
    })
    $('#input4').bind({
        keyup: function () {
            $(this).css('width', $(this).val().length * 10)
            $('#body2-top-span2').html($(this).val())
        },
        change: function () {
            $(this).css('width', $(this).val().length * 10)
            $('#body2-top-span2').html($(this).val())
        }
    })
    $('#input5').bind({
        keyup: function () {
            $(this).css('width', $(this).val().length * 15.4)
            $('#body2-top-span3').html($(this).val())
        },
        change: function () {
            $(this).css('width', $(this).val().length * 15.4)
            $('#body2-top-span3').html($(this).val())
        }
    })
    $('#input6').bind({
        keyup: function () {
            $(this).css('width', $(this).val().length * 15.4)
            $('#body2-top-span4').html($(this).val())
        },
        change: function () {
            $(this).css('width', $(this).val().length * 15.4)
            $('#body2-top-span4').html($(this).val())
        }
    })
    $('#input7').bind({
        keyup: function () {
            $(this).css('width', $(this).val().length * 13)
            $('#body2-top-span5').html($(this).val())
        },
        change: function () {
            $(this).css('width', $(this).val().length * 13)
            $('#body2-top-span5').html($(this).val())
        }
    })
    $('#input8').bind({
        keyup: function () {
            $(this).css('width', $(this).val().length * 12.5)
            $('#body2-top-span6').html($(this).val())
        },
        change: function () {
            $(this).css('width', $(this).val().length * 12.5)
            $('#body2-top-span6').html($(this).val())
        }
    })
    $('#fill-formwork-button1').click(function () {
        clearCookie('formwork-h2')
        clearCookie('formwork-p')
        clearCookie('formwork-span1')
        clearCookie('formwork-span2')
        clearCookie('formwork-span3')
        clearCookie('formwork-span4')
        clearCookie('formwork-span5')
        clearCookie('formwork-span6')
        setCookie('formwork-h2', $('#input1').val())
        setCookie('formwork-p', $('#input2').val())
        setCookie('formwork-span1', $('#input3').val())
        setCookie('formwork-span2', $('#input4').val())
        setCookie('formwork-span3', $('#input5').val())
        setCookie('formwork-span4', $('#input6').val())
        setCookie('formwork-span5', $('#input7').val())
        setCookie('formwork-span6', $('#input8').val())
        $('#fill-wrap').html(`
        <h4 style="text-align: center;">填充试卷内容</h4>
        <div style="text-align: center;">
        课程：
        <select>
            <option>软件建模技术</option>
            <option>软件项目管理</option>
            <option>jquery</option>
        </select>
        <div>
            <input type="checkbox" id="radio1">单选题：<input id="radio-input" type="number" min="0" style="width:100px;text-align:center;" placeholder="题目数量">
            章节:
        <select>
            <option>软件项目管理导论</option>
            <option>软件项目立项</option>
            <option>软件开发过程</option>
        </select>
        <a href="#" id="radio1zj-add" class="iconfont icon-jia" style="text-decoration:none;color:blue"></a>
        <br>
        <div id="radio1zj" style="text-align:left"></div>
        </div>
        <div>
            <input type="checkbox" id="checkbox1">多选题：<input id="checkbox-input" type="number" min="0" style="width:100px;text-align:center;" placeholder="题目数量">
            章节:
            <select>
                <option>软件项目管理导论</option>
                <option>软件项目立项</option>
                <option>软件开发过程</option>
            </select>
            <a href="#" id="checkbox1zj-add" class="iconfont icon-jia" style="text-decoration:none;color:blue"></a>
            <br>
            <div id="checkbox1zj" style="text-align:left"></div>
        </div>
        <div>
            <input type="checkbox" id="judge1">判断题：<input id="judge-input" type="number" min="0" style="width:100px;text-align:center;" placeholder="题目数量">
            章节:
            <select>
                <option>软件项目管理导论</option>
                <option>软件项目立项</option>
                <option>软件开发过程</option>
            </select>
            <a href="#" id="judge1zj-add" class="iconfont icon-jia" style="text-decoration:none;color:blue"></a>
            <br>
            <div id="judge1zj" style="text-align:left"></div>
        </div>
        <div>
            <input type="checkbox" id="fill1">填空题：<input id="fill-input" type="number" min="0" style="width:100px;text-align:center;" placeholder="题目数量">
            章节:
            <select>
                <option>软件项目管理导论</option>
                <option>软件项目立项</option>
                <option>软件开发过程</option>
            </select>
            <a href="#" id="fill1zj-add" class="iconfont icon-jia" style="text-decoration:none;color:blue"></a>
            <br>
            <div id="fill1zj" style="text-align:left"></div>
        </div>
        <div>
            <input type="checkbox" id="short1">简答题：<input id="short-input" type="number" min="0" style="width:100px;text-align:center;" placeholder="题目数量">
            章节:
            <select>
                <option>软件项目管理导论</option>
                <option>软件项目立项</option>
                <option>软件开发过程</option>
            </select>
            <a href="#" id="short1zj-add" class="iconfont icon-jia" style="text-decoration:none;color:blue"></a>
            <br>
            <div id="short1zj" style="text-align:left"></div>
        </div>
        </div>
        
        <div style="text-align: center;">
            <button id="fill-formwork-button2">
                出卷
            </button>
        </div>
        `)
    })
    var i1=0; //单选
    var i2=0; //多选
    var i3=0; //判断
    var i4=0; //填空
    var i5=0; //简答
    $('#fill-wrap').on('mouseover', function () {
        // 单选
        $('#radio1zj-add').off("click").click(function(){
            i1++;
            k = i1 + 1;
            $('#radio1zj').append(`
            <select id="radio1zj-`+k+`">
                <option>软件项目管理导论</option>
                <option>软件项目立项</option>
                <option>软件开发过程</option>
            </select>
            <a href="#" id="1remove` + k + `" value="` + k + `" class="iconfont icon-jian remove1"></a>
            `)
        })
        $('.remove1').off("click").click(function(){
            var index = $(this).attr('value')
            $('#1remove' + index + '').remove()
            $('#radio1zj-' + index + '').remove()
        })
        // 多选
        $('#checkbox1zj-add').off("click").click(function(){
            i2++;
            k = i2 + 1;
            $('#checkbox1zj').append(`
            <select id="checkbox1zj-`+k+`">
                <option>软件项目管理导论</option>
                <option>软件项目立项</option>
                <option>软件开发过程</option>
            </select>
            <a href="#" id="2remove` + k + `" value="` + k + `" class="iconfont icon-jian remove2"></a>
            `)
        })
        $('.remove2').off("click").click(function(){
            var index = $(this).attr('value')
            $('#2remove' + index + '').remove()
            $('#checkbox1zj-' + index + '').remove()
        })
        // 判断
        $('#judge1zj-add').off("click").click(function(){
            i4++;
            k = i4 + 1;
            $('#judge1zj').append(`
            <select id="judge1zj-`+k+`">
                <option>软件项目管理导论</option>
                <option>软件项目立项</option>
                <option>软件开发过程</option>
            </select>
            <a href="#" id="3remove` + k + `" value="` + k + `" class="iconfont icon-jian remove3"></a>
            `)
        })
        $('.remove3').off("click").click(function(){
            var index = $(this).attr('value')
            $('#3remove' + index + '').remove()
            $('#judge1zj-' + index + '').remove()
        })
        // 填空
        $('#fill1zj-add').off("click").click(function(){
            i4++;
            k = i4 + 1;
            $('#fill1zj').append(`
            <select id="fill1zj-`+k+`">
                <option>软件项目管理导论</option>
                <option>软件项目立项</option>
                <option>软件开发过程</option>
            </select>
            <a href="#" id="4remove` + k + `" value="` + k + `" class="iconfont icon-jian remove4"></a>
            `)
        })
        $('.remove4').off("click").click(function(){
            var index = $(this).attr('value')
            $('#4remove' + index + '').remove()
            $('#fill1zj-' + index + '').remove()
        })
        // 简答
        $('#short1zj-add').off("click").click(function(){
            i5++;
            k = i5 + 1;
            $('#short1zj').append(`
            <select id="short1zj-`+k+`">
                <option>软件项目管理导论</option>
                <option>软件项目立项</option>
                <option>软件开发过程</option>
            </select>
            <a href="#" id="5remove` + k + `" value="` + k + `" class="iconfont icon-jian remove5"></a>
            `)
        })
        $('.remove5').off("click").click(function(){
            var index = $(this).attr('value')
            $('#5remove' + index + '').remove()
            $('#short1zj-' + index + '').remove()
        })
        $('#fill-formwork-button2').click(function () {
            // clearCookie('formwork-h2')
            // clearCookie('formwork-p')
            // clearCookie('formwork-span1')
            // clearCookie('formwork-span2')
            // clearCookie('formwork-span3')
            // clearCookie('formwork-span4')
            // clearCookie('formwork-span5')
            // clearCookie('formwork-span6')
            // setCookie('formwork-h2', $('#input1').val())
            // setCookie('formwork-p', $('#input2').val())
            // setCookie('formwork-span1', $('#input3').val())
            // setCookie('formwork-span2', $('#input4').val())
            // setCookie('formwork-span3', $('#input5').val())
            // setCookie('formwork-span4', $('#input6').val())
            // setCookie('formwork-span5', $('#input7').val())
            // setCookie('formwork-span6', $('#input8').val())
            window.location.href = 'formwork.html'
        })
    })

    $('#autodata').click(function () {
        $('#input1').val('广西民族大学相思湖学院课程考试试卷')
        $('#input2').val('(2018-2019) 学年度第一学期 期末考试')
        $('#input3').val('数据结构与算法')
        $('#input4').val('120')
        $('#input5').val('闭卷考查')
        $('#input6').val('吴天志')
        $('#input7').val('4')
        $('#input8').val('2015年级计算机科学与技术(软件工程方向)专业')
        $('#input1').css('width', $('#input1').attr('placeholder').length * 14.4)
        $('#input2').css('width', $('#input2').attr('placeholder').length * 10.1)
        $('#input3').css('width', $('#input3').attr('placeholder').length * 14.4)
        $('#input4').css('width', $('#input4').attr('placeholder').length * 10)
        $('#input5').css('width', $('#input5').attr('placeholder').length * 15.4)
        $('#input6').css('width', $('#input6').attr('placeholder').length * 15.4)
        $('#input7').css('width', $('#input7').attr('placeholder').length * 13)
        $('#input8').css('width', $('#input8').attr('placeholder').length * 12.5)
    })
})